<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="viewport" content="width=device-width, user-scalable=no,
 initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta charset="UTF-8">
    <title>马哥教育博客项目</title>
    <script src="jquery.js"></script>
    <link rel="stylesheet" type="text/css" href="datatable/css/datatables.min.css"/>
    <link rel="stylesheet" type="text/css" href="datatable/css/buttons.dataTables.min.css"/>
    <link rel="stylesheet" type="text/css" href="datatable/css/editor.dataTables.min.css"/>
    <link rel="stylesheet" type="text/css" href="datatable/css/select.dataTables.min.css"/>

    <script type="text/javascript" src="datatable/js/datatables.min.js"></script>
    <script type="text/javascript" src="datatable/js/dataTables.buttons.min.js"></script>
    <script type="text/javascript" src="datatable/js/pdfmake.min.js"></script>
    <script type="text/javascript" src="datatable/js/vfs_fonts.js"></script>
    <script type="text/javascript" src="datatable/js/dataTables.editor.min.js"></script>
    <script type="text/javascript" src="datatable/js/dataTables.select.min.js"></script>
    <script type="text/javascript" src="datatable/js/papaparse.min.js"></script>
<!--    <script>-->
<!--        function selectColumns ( editor, csv, header ) {-->
<!--            console.log(csv, "this is csv");-->
<!--            var selectEditor = new $.fn.dataTable.Editor();-->
<!--            var fields = editor.order();-->
<!--            for ( var i=0 ; i<fields.length ; i++ ) {-->
<!--                var field = editor.field( fields[i] );-->

<!--                selectEditor.add( {-->
<!--                    label: field.label(),-->
<!--                    name: field.name(),-->
<!--                    type: 'select',-->
<!--                    options: header,-->
<!--                    def: header[i]-->
<!--                } );-->
<!--            }-->

<!--            selectEditor.create({-->
<!--                title: 'CSV文件映射到的字段',-->
<!--                buttons: '导入 '+csv.length+'条记录',-->
<!--                message: 'Select the CSV column you want to use the data from for each field.'-->
<!--            });-->

<!--            selectEditor.on('submitComplete', function (e, json, data, action) {-->
<!--                // Use the host Editor instance to show a multi-row create form allowing the user to submit the data.-->
<!--                editor.create( csv.length, {-->
<!--                    title: 'Confirm import',-->
<!--                    buttons: 'Submit',-->
<!--                    message: 'Click the <i>Submit</i> button to confirm the import of '+csv.length+' rows of data. Optionally, override the value for a field to set a common value by clicking on the field below.'-->
<!--                } );-->

<!--                for ( var i=0 ; i<fields.length ; i++ ) {-->
<!--                    var field = editor.field( fields[i] );-->
<!--                    var mapped = data[ field.name() ];-->
<!--                    console.log(field, mapped);-->

<!--                    for ( var j=0 ; j<csv.length ; j++ ) {-->
<!--                        field.multiSet( j, csv[j][mapped] );-->
<!--                    }-->
<!--                }-->
<!--                console.log(data,"!!!!!!!!!!", field);-->
<!--            } );-->
<!--        }-->
<!--        $(document).ready( function () {-->
<!--                var editor = new $.fn.dataTable.Editor( {-->
<!--                    ajax: "/api/result/upload_result/",-->
<!--                    table: "#table_id",-->
<!--                    fields: [ {-->
<!--                        label: "学号:",-->
<!--                        name: "stu_id"-->
<!--                    }, {-->
<!--                        label: "语文:",-->
<!--                        name: "chinese"-->
<!--                    }, {-->
<!--                        label: "数学:",-->
<!--                        name: "math"-->
<!--                    }, {-->
<!--                        label: "英语:",-->
<!--                        name: "english"-->
<!--                    }-->
<!--                    ]-->
<!--                } );-->
<!--                var uploadEditor = new $.fn.dataTable.Editor( {-->
<!--                    fields: [ {-->
<!--                        label: 'CSV file:',-->
<!--                        name: 'csv',-->
<!--                        type: 'upload',-->
<!--                        ajax: function ( files ) {-->
<!--                            // Ajax override of the upload so we can handle the file locally. Here we use Papa-->
<!--                            // to parse the CSV.-->
<!--                            Papa.parse(files[0], {-->
<!--                                header: true,-->
<!--                                skipEmptyLines: true,-->
<!--                                complete: function (results) {-->
<!--                                    if ( results.errors.length ) {-->
<!--                                        console.log( results );-->
<!--                                        uploadEditor.field('csv').error( 'CSV parsing error: '+ results.errors[0].message );-->
<!--                                    }-->
<!--                                    else {-->
<!--                                        uploadEditor.close();-->
<!--                                        selectColumns( editor, results.data, results.meta.fields );-->
<!--                                    }-->
<!--                                }-->
<!--                            });-->
<!--                        }-->
<!--                    } ]-->
<!--                } );-->
<!--                $('#table_id').DataTable({-->
<!--                    dom: 'Bftrlip',-->
<!--                    buttons: [-->
<!--                        {-->
<!--                            extend: "collection",-->
<!--                            text: "导出",-->
<!--                            buttons: ["excel", "pdf", "csv"]-->
<!--                        },-->
<!--                        {-->
<!--                            extend: "print",-->
<!--                            text: "打印"-->
<!--                        },-->
<!--                        {-->
<!--                            text: '导入 CSV',-->
<!--                            action: function () {-->
<!--                                uploadEditor.create( {-->
<!--                                    title: 'CSV file import'-->
<!--                                } );-->
<!--                            }-->
<!--                        }-->

<!--                    ],-->
<!--                    ajax: '/api/result/get_all_result/',-->
<!--                    columns: [-->
<!--                        { data: 'stu_id' },-->
<!--                        { data: 'chinese' },-->
<!--                        { data: 'math' },-->
<!--                        { data: 'english' }-->
<!--                    ]-->
<!--                });-->


<!--            var a = 1;-->
<!--            console.log(a);-->
<!--        }-->
<!--        );-->
<!--    </script>-->
</head>
<body>
<!--<h1>马哥教育博客项目</h1>-->
<!--<ul>-->
<!--	<li>采用前后端分离开发模式</li>-->
<!--	<li>前端使用最新的React技术，后端使用Django框架</li>-->
<!--	<li>使用Restful风格设计API接口</li>-->
<!--	<li>无session认证jwt技术，强密码技术</li>-->
<!--	<li>阿里开源Antd组件</li>-->
<!--	<li>企业级nginx + uWSGI + Django部署</li>-->
<!--</ul>-->
<!--<hr>-->
<div id="root"></div>
<script src="/assets/bundle.js"></script>
</body>
</html>